<template>
  <view class="registration">
    <!--    左侧-->
    <view class="left">
      <scroll-view scroll-y style="height:568px;">
        <view class="li" :class="{a:index==item._id}" v-for="(item) in departmentlist" :key="item._id"
              @click="add(item._id)">
          {{ item.dep_ment }}
        </view>
      </scroll-view>
    </view>
    <view class="right">
      <view class="rightbox" v-for="item in depmentlist.dep_ment_list" :key="item.dep_id" @click="go(item)">{{ item.dep_name }}
      </view>
    </view>
  </view>
</template>
<script>
import {department, getreglist} from "utils/API/registation"

export default {
  data() {
    return {
      departmentlist: [],
      index: "af2b6af462e1780b000b7ac649eef401",
      depmentlist: []
    };
  },
  async mounted() {
    let {data} = await department()
    this.departmentlist = data
    this.depmentlist = data
    this.add(this.index)
  },
  methods: {
    //点击左侧栏右边的数据
    async add(id) {
      this.index = id
      let {data} = await getreglist(this.index)
      this.depmentlist = data[0]
    },
    //点击二级分类跳转页面
    go(item){
      wx.navigateTo({
        url:"/pages/doctorList/doctorList?id="+item.dep_id
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.a {
  color: #4485f0;
  background-color: #fff !important;
}

.registration {
  width: 100%;
  display: flex;

  .left {
    width: 100px;
    background-color:#fff;

    .li {
      width: 100%;
      height: 50px;
      background-color: #f1ecec;
      line-height: 50px;
      text-align: center;
    }
  }

  .right {
    flex: 1;
    background-color: #fff;

    .rightbox {
      width: 100%;
      height: 50px;
      line-height: 50px;
      padding-left: 10px;
    }
  }
}
</style>
